<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8" isELIgnored="false"%>
<%@ include file="/WEB-INF/common/head.jsp"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>

<head>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="renderer" content="webkit">
<title>公告显示</title>
<link href="${resource }/css/bootstrap.css" rel="stylesheet">
<link href="${resource }/css/style.css?v=2.2.0" rel="stylesheet">
<link rel="stylesheet" href="${resource }/css/iconfont.css" />
<link rel="stylesheet"  href="${resource }/css/notices.css" />
</head>

<body style="background-color: #f3f3f4;">
	<div class="row wrapper border-bottom white-bg page-heading">
		<div id="title1" class="col-sm-4">
			<h2>公告</h2>
			<ol class="breadcrumb">
				<li><a href="index.html">主页</a></li>
				<li><strong>所有公告</strong></li>
			</ol>
		</div>
	</div>
	<div class="row wrapper border-bottom white-bg page-heading">
		<div class="col-lg-12">
			<div class="wrapper wrapper-content animated fadeInUp">

				<div class="ibox">
					<div class="ibox-title">
						<h5>所有项目</h5>
						<div class="ibox-tools">
							<a href="creatNotice.do" class="btn btn-primary btn-xs">创建新公告</a>
						</div>
					</div>
					<div class="ibox-content">
						<div class="row m-b-sm m-t-sm">
							<div class="col-md-1">
								<button type="button" id="loading-example-btn"
									class="btn btn-white btn-sm">
									<i class="iconfont icon-shuaxin"></i>刷新
								</button>
							</div>
							<div class="col-md-11">
								<div class="input-group">
									<input type="text" placeholder="请输入标题"
										class="input-sm form-control"> <span
										class="input-group-btn">
										<button type="button" class="btn btn-sm btn-primary">
											搜索</button>
									</span>
								</div>
							</div>
						</div>

						<div class="project-list">

							<table class="table table-hover">
								<tbody>
									<tr>
										<td class="project-status">状态</td>
										<td class="project-title">标题</td>
										<td class="project-title">更新日期</td>
										<td class="project-title">已读</td>
										<td class="project-actions">操作</td>
										<td><input type="checkbox" id="selectall">全选</td>
									</tr>
									<c:forEach items="${noticeList }" var="notice">
										<tr>
											<td class="project-status"><c:if
													test="${notice.isPublish==1}">
													<span class="label label-primary"><c:out value="已发布" /></span>
												</c:if> <c:if test="${notice.isPublish==0}">
													<span class="label label-primary"><c:out value="待发布" /></span>
												</c:if></td>
											<td class="project-title"><a
												href="showDetail.do?id=${notice.id }">${notice.noticeTitle }</a>
											</td>
											<td class="project-list">${notice.date }</td>
											<td class="project-title">${notice.readNum }</td>
											<td class="project-actions"><a
												href="deleteNotice.do?id=${notice.id }"
												class="btn btn-white btn-sm"><i
													class="iconfont icon-shanchu"></i> 删除 </a> <a
												href="editNotice.do?id=${notice.id }"
												class="btn btn-white btn-sm"><i
													class="iconfont icon-shuru"></i> 编辑 </a></td>
											<td id="check"><input type="checkbox"></td>
										</tr>
									</c:forEach>
								</tbody>
							</table>
						</div>
						<!--分页显示-->
						<div class="row">
							<div class="col-md-6">
								<div class="pagination" style="margin: 0px;" role="alert" aria-live="polite" aria-relevant="all">显示 1 到 ${notice.getPages()} 页 记录数${notice.getTotal()}</div>
							</div>
							<!-- 动态分页 -->
							<div class="row">
							<div id="page" class="col-md-6" style="text-align: right;float:right;" ></div>
							</div>
						</div>
						<!--分页显示-->
					</div>
				</div>
			</div>
		</div>
	</div>


	<!-- Mainly scripts -->
	<script src="${resource }/js/jquery-2.1.1.min.js"></script>
	<script src="${resource }/js/bootstrap.min.js?v=3.4.0"></script>
	<script src="${resource }/js/plugins/metisMenu/jquery.metisMenu.js"></script>
	<script
		src="${resource }/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>

	<!-- Custom and plugin javascript -->
	<script src="${resource }/js/hplus.js?v=2.2.0"></script>
	<script src="${resource }/js/plugins/pace/pace.min.js"></script>
	<!-- 分页插件，依赖于jquery位于jquery之后 -->
	<script src="${resource }/js/page.js"></script>
	<script>
		//实现全选
		$("#selectall").click(function() {
			if (this.checked) {
				$("#check :checkbox").prop("checked", true);
			} else {
				$("#check :checkbox").prop("checked", false);
			}
		});
	</script>
	<script type="text/javascript">
		$("#loading-example-btn").click(function(){
			location.reload();
		});
	</script>
	<script >
	$(function(){
			/* 分页插件使用 */
			$("#page").page({/* #page是分页条div的id，调用分页插件page.js中封装的page函数*/
				pageNo:${notice.getPageNo()},/*向page函数传  当前页数，当前页数从controller获取*/
				totalPage:${notice.getPages()},/*向page函数传  总页数，总页数从controller获取*/
				url:"${notice.getUrl()}"/*向page函数传  处理分页的controller地址*/
			});
		}) 
	</script>
</body>
</html>